<template>
<uni-shadow-root class="view-new-aikucun-measure_card"><template v-if="wxTemplateName === 'measure_card'"> 
     
 
<view v-if="showCount" @click.stop.prevent="_$self.$parent.$parent[('doNothing')]($event)" class="measure_card" @touchmove.stop.prevent="_$self.$parent.$parent[('doNothing')]($event)">
  
  <view class="countContainer">
     
    
       <view class="countContainer_top"> 
        <view class="countContainer_top_image">
          <image mode="aspectFill" :data-url="focusData.imagePath" :data-urls="focusData.imageListWatcher" @click="_$self.$parent.$parent[('_watchBigImage')]($event)" :src="focusData.imagePath"></image>
        </view>
        <view class="countContainer_top_product_info_container">
           <view class="font_1">{{focusData.name}}</view>
           <view class="font_aaa font_08">商品编号: {{focusData.orderNumber}}</view>

           
           <view v-if="focusData.measureItem==0">
              <text class="price font_14" v-if="focusData.measureItem == 0">￥{{focusData.price}}</text>
              <text class="marginleft" v-if="focusData.measureItem==0&&focusData.stock<=10">(仅剩：{{focusData.stock}})</text>
           </view>
           <view v-if="focusData.measureItem==1">
            <text class="price font_14">￥{{measurementJson.price}}</text>
            <text class="marginleft" v-if="focusData.measureItem==1&&measurementJson.stock<=10">(仅剩：{{measurementJson.stock}})</text>
           </view>
        </view>
      </view>
      <view class="measureItemContainer" v-if="focusData.measureTypes">
        <view v-for="(types,index) in (focusData.measureTypes)" :key="types.index" class="cardMid">
          <view class="cardMidName">{{types.name}}</view>
          <radio-group class="cardMidGuigeContainer" :name="types.name" @change="_$self.$parent.$parent[('chooseMeasure')]($event)">
            <label v-for="(Measure,i) in (types.productAssignMeasure)" :key="Measure.i" class="font_08" :data-index="(index)+'-'+(i)" @click="_$self.$parent.$parent[('radioChange')]($event)">
              <view :class="types.checkedMeasureItem == i? "activeMeasure":""" :style="'background:'+(types.checkedMeasureItem == i? setting.platformSetting.defaultColor:"")+';color:'+(types.checkedMeasureItem == i? "#fff":setting.platformSetting.defaultColor)">{{Measure.measureName}}</view>
              <radio :checked="types.checkedMeasureItem == i" :value="(Measure.measureTypeName)+'-'+(Measure.id)" hidden="true"></radio>
            </label>
          </radio-group>
        </view>
      </view>
      <view class="error_view font_08" :style="'background:'+(setting.platformSetting.defaultColor)" v-if="focusData.measureItem==1 && (measurementJson.stock < byNowParams.itemCount)">
        <text>库存不足:(</text>
        <text v-for="(mtype,a) in (measurementJson.measurements)" :key="mtype.a">-{{mtype.measureName}}</text>
        <text>)剩余库存【{{measurementJson.stock}}】</text>
      </view>


      <view class="ItemCountDell">
        <view class="font_777 font_09">购买数量{{minCount}}</view>
        <view class="item_infomation_nums"> 
            <image style="border-top-left-radius: 0.2em;border-bottom-left-radius: 0.2em;" src="https://image1.sansancloud.com/xianhua/2019_12/17/21/40/33_565.jpg?x-oss-process=style/preview_120" :class="byNowParams.itemCount == minCount?"noadd":""" @click.stop.prevent="_$self.$parent.$parent[('subNum')]($event)"></image>
            <text class="flexCenter">{{byNowParams.itemCount}}</text>
            <image style="border-top-right-radius: 0.2em; border-bottom-right-radius: 0.2em;" src="https://image1.sansancloud.com/xianhua/2019_12/17/21/40/33_660.jpg?x-oss-process=style/preview_120" :class="byNowParams.itemCount > measurementJson.stock?"noadd":""" :data-cantadd="(byNowParams.itemCount > measurementJson.stock?1:0)+' '" @click.stop.prevent="_$self.$parent.$parent[('addNum')]($event)"></image>
          </view>
      </view>

      <button style="background:linear-gradient(132.2deg,rgba(255,153,110,1),rgba(254,55,55,1));" class="sureButn" :disabled="measurementJson.stock < byNowParams.itemCount||!measurementJson.waitDataState" @click="_$self.$parent.$parent[('buyNow')]($event)">确定</button>
    </view>
    
  
<view class="zhezhao" v-if="showCount" @click="_$self.$parent.$parent[('closeZhezhao')]($event)"></view>
</view>
</template></uni-shadow-root>
</template>

<script>

global['__wxRoute'] = 'view-new/aikucun/measure_card'

Component({})

export default global['__wxComponents']['view-new/aikucun/measure_card']
</script>
<style platform="mp-weixin">
/* 多规格页面 */

 .measure_card{
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   top: 0;
   width: 100%;
   height: 100%;

   z-index: 12;
 }
/* 数量 */
.countContainer{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  min-height: 12.6em;
  background: #fff;
  z-index: 12;
  display: flex;
  flex-direction: column;
  padding: 1em; 
  max-height: 90%; 
  overflow-y: scroll;

}
.closeButn{
  position: absolute;
  right: 1em;
  top: 5em;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.countContainer_top{
  display: flex;
  flex-direction: row;
  align-items: center;
    font-size:0.8em;
}
.countContainer_top_image{
  width: 6em;
  height: 6em;
  border: 1rpx solid #ddd;
  border-radius: 0.2em;
  overflow: hidden;
}
.countContainer_top_image > image{
  width: 100%;
  height: 100%;
}

.countContainer_top_product_info_container{
  margin-left: 0.4em;
  word-break: break-all;
  display: flex;
  flex-direction: column;
  width:70%;

}






/* 规格 */

.measureItemContainer{
  display: flex;
  flex-direction: column;
}
.cardMid{
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.cardMidName{
  color: #aaa;
  padding: 0.4em 0;
  font-size: 0.9em;
}
.cardMidGuigeContainer{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  padding:0 ;


}
.cardMidGuigeContainer view{
  margin-right: 0.4em;
  /* padding: 0.4em 0.8em; */
  min-width: 4em;
  padding-left:0.5em;
  padding-right: 0.5em; 
  /* height: 2em; */
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.2em;
  color: #e24148;
  border: 1px solid #ddd;
  margin-bottom: 0.1em;

  padding-top: 0.11em;
  padding-bottom: 0.11em;
  
}
.activeMeasure{
   /* border: 1px solid red !important; */
   /* background: #e24148 !important; */
   color: #fff !important;
}

.sureButn{
  width: 100%;
  height: 2.6em;
  color: #fff;
  background: deeppink;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.4em;
}
.sureButnType{
  width: 45%;
  height: 2.6em;
  color: #fff;
  background: deeppink;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.4em;
}
.ItemCountDell{
  padding: 0.4em 0;
  height: 3em;
  background: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.error_view{
  padding: 0.4em 0;
  color: #fff;
  border-radius:0.4em;
  text-indent:0.4em;

}
/* 加和减 */
.item_infomation_nums{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  font-size: 0.8em;
  border-radius: 0.2em;
  overflow: hidden;
  margin-left: 1em;
  

  
}

.item_infomation_nums image{
  height: 1.4em;
  width: 1.4em;
  padding: 0.4em;
  border: 1rpx solid #aaa;
}
.item_infomation_nums text{
  height: 1.4em;
  width:2.2em;
  padding: 0.4em;
  border-top: 1rpx solid #aaa;
  border-bottom: 1rpx solid #aaa;
}


.price{
  color: red;
}


.tagPrice_font{
  font-size: 24rpx;
  line-height:24rpx;
  color:#aaa;
  text-decoration:line-through;
  margin-left: 8rpx
}
.price_group{
  display: flex;
  flex-direction: row;
  align-items: baseline;
  height:40rpx;
  margin-top: 10rpx
}
.noPintuan{
  height:40rpx;
  line-height:40rpx;
}
.pintuan{
  line-height:40rpx;
}
.zhezhao {
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:#000;
opacity:0.6;
z-index:10;

}
.font_aaa {
  color:#aaa;
}
.font_1 {
  font-size:1em;
}
.flexCenter {
display:flex;
align-items:center;
justify-content:center;
}
.font_14 {
  font-size:1.4em;
}
.noadd {
  background:#eee;
}
</style>